import React from 'react'
import {Table, Popover, Pagination, Icon} from 'antd'
import ContentMenu from './contentMenu'
import './cms.less'



//表格组件
const TableView = (props) => {

  const {rowSelection, pageParam, dataSource, columns, loading, rowKey} = props;
  if(columns.length==0){
    return <div></div>;
  };
  const newCol = columns.map(function (item, key) {
    if (item.optType ) {
      item.render = (text, record, index) => (
          <span>
            <span onClick={item.optType.edit.fn.bind(this,record)} style={{display: item.optType.edit.show ? 'inline-block' : 'none',marginLeft: "13px"}}>
              <Icon type="edit"/>
            </span>
            <span onClick={item.optType.edit.fn.bind(this,record)} style={{display: item.optType.detele.show ? 'inline-block' : 'none',marginLeft: "13px"}}>
              <Icon type="delete" />
            </span>
          </span>
      );
      return item;
    } else {
      return item;
    }
  });

  const pagination = {
    total: dataSource.total,
    pageSize: pageParam.pageSize,
    pageSizeOptions: ['1','10', '20', '30', '40'],
    showTotal: total => `共 ${total} 条`,
    showSizeChanger: true,
    showQuickJumper: true,
    onShowSizeChange: pageParam.onShowSizeChange,
    onChange: pageParam.onChange,
    size: "small"
  };
  if (pageParam.current) {
    pagination.current = pageParam.current;
  }
  return <div style={{marginTop:'40px'}}>
    <Table rowSelection={rowSelection}
           bordered
           columns={newCol}
           loading={loading}
           dataSource={dataSource.datas}
           pagination={pagination}
           size="middle"
    />
  </div>
};

export default TableView
